<template>
  <div class="users">
    <!-- <el-avatar shape="square" :size="150" :src="123">
    </el-avatar> -->
    <el-descriptions title="我的中心">
      <el-descriptions-item label="用户名">{{
        userInfo.username
      }}</el-descriptions-item>
      <el-descriptions-item label="昵称">{{
        userInfo.nickname
      }}</el-descriptions-item>
      <el-descriptions-item label="性别">{{
        userInfo.sex
      }}</el-descriptions-item>
      <el-descriptions-item label="国家">{{
        userInfo.country
      }}</el-descriptions-item>
      <el-descriptions-item label="省市">{{
        userInfo.province
      }}</el-descriptions-item>
      <el-descriptions-item label="职能">{{
        userInfo.roles
      }}</el-descriptions-item>
      <el-descriptions-item label="VIP等级">{{
        userInfo.vipLevel
      }}</el-descriptions-item>
      <el-descriptions-item label="id地址">{{
        userInfo._id
      }}</el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
import { mapState, mapMutations } from "vuex";
export default {
  computed: {
    ...mapState(["userInfo"]),
  },
};
</script>
